<template>
	<view>
		<view class="padding rowsb align-center bg-white solid-bottom" style="border-top: 20rpx solid #EEEEEE;">
			<view>
				会员姓名
			</view>
			<view class="text-gray">
				<input type="text" value="" placeholder="请输入会员姓名" v-model="userName" />
			</view>
		</view>
		<view class="padding rowsb align-center bg-white solid-bottom">
			<view>
				会员手机号
			</view>
			<input type="number" maxlength="11" value="" placeholder="请输入会员手机号" v-model="userPhone" />
		</view>
		<view class="padding rowsb align-center bg-white solid-bottom">
			<view>
				学车班型
			</view>
			<view class="text-gray">
				<picker @change="PickerChange" :value="index" :range='picker' range-key="title" >
					<view class="picker">
						{{index>-1?picker[index].title:'请选择'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="padding rowsb align-center bg-white solid-bottom">
			<view>
				价格
			</view>
			<view class="text-red" >
				{{'￥'+pickerPrice || ''}}
			</view>
		</view>
		<view class="padding rowsb align-center bg-white solid-bottom">
			<view>
				报名押金
			</view>
			<view class="text-red">
				￥{{price}}
			</view>
		</view>
		<view class="padding rowsb align-center bg-white solid-bottom">
			<view>
				选择教练
			</view>
			<view class="">
				<picker @change="PickerChange01" :value="index01" :range="coachList" range-key="name">
					<view class="picker">
						{{index01>-1?coachList[index01].name:'选择教练'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="bg-white rows padding">
			<view class="margin-right">
				备注
			</view>
			<view>
				<textarea value="" placeholder="请输入" class="border" style="height: 200rpx;" v-model="contentInfo" />
				</view>
		</view>
		<view class="bg-white padding">
			<view class="  text-center padding-sm radius" style="border: 1rpx solid #E5E5E5;" @click="submit">
				立即报名
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp().globalData
	import {productSignUp,aliplice,signUpList,getjiaolian} from '@/common/path.js'
	export default {
		data() {
			return {
				time: '',
				userName:'',//会员姓名
				userPhone:'',//手机号
				price:'20.00',
				picker: [],
				coachList: [], //教练列表
				index:-1,
				index01:-1,//选择教练
				contentInfo:'',//备注
				pickerId:'',//班型id
				pickerData:'',//班型名称
				pickerPrice:'请先选择学车类型',//学车价格
				payDataType:'',//支付类型
				orderId:'',//提交后的订单id
				coachId:'',//选择的教练id
			}
		},
		
		
		onLoad() {
			this.signUpList() // 车型列表
			this.getjiaolian() //教练列表
		},
		methods:{
			//选择的教练id
			PickerChange01(event){
				this.coachList[event.detail.value].id
				this.coachId = this.coachList[event.detail.value].id
				this.index01 = event.detail.value
				console.log('[选择的教练id]',this.coachId);
			},
			//获取教练列表
			getjiaolian(){
				this.$axios.axios('POST',getjiaolian,{})
				.then((res)=>{
					console.log('[1-教练列表]',res);
						if(res.status ==1){
							this.coachList = res.data
						}
				})
			},
			// 获取报名学车班型列表
			signUpList(){
				this.$axios.axios('POST',signUpList,{})
				.then(res=>{
					console.log('[2-学车类型]',res.data)
					this.signDataList = res.data
					var adddata = res.data.map((item) => {
						let id = item.id
						let title = item.title
						let price = item.price
						return{
							id,
							title,
							price
						}
					})
					this.picker = adddata
					console.log('[3-最后筛选出来的学车类型]',adddata)
				})
			},
			//报名
			submit(){
				if(this.coachId ==''){
					this.$tools.showToast('请选择教练')
					return false
				}
				if(this.pickerId == ''){
					this.$tools.showToast('请选择学车班型')
				}else{
					this.productSignUp(1)
					// this.payTypeDataMen()
				}
			},
			//选择报名类型
			PickerChange(e) {
				this.index = e.detail.value
				let pickerId = this.picker[e.detail.value].id
				console.log('驾校报名id====》',pickerId)
				this.pickerId = pickerId
				this.pickerData = this.picker[e.detail.value].title
				this.pickerPrice = this.picker[e.detail.value].price
			},
			//报名接口
			productSignUp(event){
				this.payDataType = event
				let data = {
						uid:app.userInfo.id,
						username:this.userName,//会员名称
						userphone:this.userPhone,//会员手机号
						type_id:this.pickerId,//学车类型
						type_name:this.pickerData,//类型名称
						price:this.pickerPrice,//价格
						y_price:this.price,//押金
						info:this.contentInfo,//备注
						pid:this.coachId //教练id
					}
				this.$axios.axios('POST',productSignUp,data)
				.then(res=>{
					console.log('报名',res)
					if(res.status==1){
					// this.$tools.showToast(res.msg)
					this.orderId = res.data
						setTimeout(r=>{
							this.payTypeDataMen2()
						},500)
					}else{
						this.$tools.showToast(res.msg)
					}
				})
				.catch(err=>{
					console.log(err);
				})
			},
			
			//选择支付类型
			payTypeDataMen(){
				let that = this
				uni.showActionSheet({
					itemList: ['押金支付', '报名费支付'],
					success: function(res) {
						if(res.tapIndex==0){
							//押金支付
						that.productSignUp(1)
						}else{
							//报名费支付
						that.productSignUp(2)
						}
						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
						console.log('选中了第>>>>>>>>>>',res)
					},
					fail: function(res) {
						console.log(res.errMsg);
					}
				});
			},
			
			
			// 选择支付类型
			payTypeDataMen2(){
				let that = this
				uni.showActionSheet({
					itemList: ['微信支付', '支付宝支付'],
					success: function(res) {
						if(res.tapIndex==0){
							//押金支付
						that.aliplice(1)
						}else{
							//报名费支付
						that.aliplice(2)
						}
						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
						console.log('选中了第>>>>>>>>>>',res)
					},
					fail: function(res) {
						console.log(res.errMsg);
					}
				});
			},
			
			
			
			//报名转支付接口
			aliplice(event){
				let data ={
					type:this.payDataType,
					id:this.orderId,//支付订单id
					pay_type:event,//支付方式
					uid:app.userInfo.id,//用户id
				}
				this.$axios.axios('POST',aliplice,data)
				.then(res=>{
					console.log('1=>',res);
					if(res.status ==1){
						this.$tools.showToast(res.msg)
						if(event==1){
							this.wechatPay(res.data)
						}else{
							this.alipay(res.data)
						}
					}else{
						this.$tools.showToast(res.msg)
					}
				})
				.catch(err=>{
					console.log('2=>',err);
				})
			},
			
			// 微信支付
			//微信支付
			wechatPay(data) {
				console.log(data, '微信支付');
				uni.requestPayment({
					provider: 'wxpay',
					orderInfo: data,
					success: (res) => {
						console.log('wx支付=>',res)
						this.$tools.showToast('支付成功')
						setTimeout(r=>{
							this.$tools.navigateBack()
						},1000)
					},
					fail: (res) => {
						console.log(res, 'fail');
					}
				})
			},
			//支付宝支付
			alipay(data) {
				uni.requestPayment({
					provider: 'alipay',
					orderInfo: data,
					success: (res) => {
						console.log('支付宝=>',res)
						this.$tools.showToast('支付成功')
						setTimeout(r=>{
							this.$tools.navigateBack()
						},1000)
					}
				})
			},
			
			
		}
	}
</script>

<style>
	input{
		text-align:right;
		font-size: 26rpx;
	}
</style>
